﻿// JavaScript Document
/*行政区划地址统计*/
var addressName = new Array();//地址名数组
var addressSubCount = new Array();//地址子地址数量
var organizationName = new Array();
var organizationCount = new Array();
$.ajax({
    url: "/standardAddress/getAdministratorAddress",
    type: "POST",
    async: true,
    data: {},
    success: function (map) {
        for (var key in map) {
            if (!map.hasOwnProperty(key)) continue;
            addressName.push(key);
            addressSubCount.push(map[key]);
        }
        // 柱状图
        var myChartone = echarts.init(document.getElementById('chartsone'), "macarons");
        var optionone = {
            title: {
                show: true,
                text: '数量(千)',
                x: '5',
                y: '14',
                textStyle: {
                    fontSize: 10,
                    fontStyle: 'normal',
                    fontWeight: 'normal',
                    color: "#fff"
                },

            },
            tooltip: {
                trigger: 'axis'
            },
            grid: [
                {x: '30', y: '42'}],
            xAxis: [
                {
                    type: 'category',

                    axisLabel: {
                        interval: 0,
                        rotate: 0,//60度角倾斜显示
                        position: 'left',
                        textStyle: {
                            color: "#ddd",
                        }
                    },
                    data: addressName,
                    axisLine: {
                        show: true,
                        onZero: true,
                        lineStyle: {
                            color: '#fff',
                            type: 'solid',
                        },
                    },
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    axisLabel: {
                        position: 'left',
                        textStyle: {
                            color: "#fff"
                        }
                    },
                    axisLine: {
                        show: true,
                        onZero: true,
                        lineStyle: {
                            color: '#fff',
                            type: 'solid',
                        },
                    },
                    splitLine: {
                        show: true,
                        onGap: null,
                        lineStyle: {
                            color: 'rgba(255,255,255,0.2)',
                            type: 'solid',
                        }
                    },
                    splitArea: {
                        show: false,
                    },
                    axisLabel: {
                        formatter: function (value) {
                            var texts = [];
                            if (value == 0) {
                                texts.push('0');
                            }
                            else if (value <= 50000) {
                                texts.push('50');
                            }
                            else if (value <= 100000) {
                                texts.push('100');
                            }
                            else if (value <= 150000) {
                                texts.push('150');
                            } else if (value <= 200000) {
                                texts.push('200');
                            }
                            else {
                                texts.push('250');
                            }
                            return texts;

                        }
                    }

                }
            ],

            color: ['#0ea6ff'],
            series: [
                {
                    name: '地址',
                    type: 'bar',
                    barWidth: '20',
                    data: addressSubCount,
                    itemStyle: {
                        emphasis: {
                            barBorderRadius: [0, 0, 0, 0]
                        },

                        normal: {
                            barBorderRadius: [0, 0, 0, 0]
                        }
                    }/*,
                    markLine: {
                        data: [
                            {type: 'average', name: '平均值'}
                        ]
                    },*/


                }
            ],
            textStyle: [{
                fontSize: '10px',
                color: '#fff'
            }],
            lineStyle: [{
                color: '#000'
            }]
        };
        myChartone.setOption(optionone);
    },
    dataType: "json"
});

/*组织机构统计*/
$.ajax({
    url: "/standardAddress/getOrganizationList",
    type: "POST",
    async: true,
    data: {},
    success: function (map) {
        for (var key in map) {
            if (!map.hasOwnProperty(key)) continue;
            if (map[key] == 0) continue;
            organizationName.push(key);
            organizationCount.push({value: map[key], name: key});
        }
        // 饼状图
        var myCharttwo = echarts.init(document.getElementById('chartstwo'), "macarons");
        var optiontwo = {
            title: {
                x: 'left',
                textStyle: {
                    fontSize: 10,
                    fontStyle: 'normal',
                    fontWeight: 'normal',
                    color: "#fff"
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                y: 'center',
                textStyle: {
                    fontSize: 10,
                    color: "#fff"
                },
                data: organizationName
            },
            calculable: true,
            series: [
                {
                    name: '辖区地址',
                    type: 'pie',
                    radius: '72%',
                    center: ['60%', '50%'],
                    data: organizationCount
                }
            ]
        };
        myCharttwo.setOption(optiontwo);
    },
    error: function (resp) {
        layer.msg("加载失败");
    },
    dataType: "json"
});

// 柱状图-接口统计
var myChartthree = echarts.init(document.getElementById('chartsthree'), "macarons");
var optionthree = {
    title: {
        show: true,
        text: '数量(千)',
        x: '5',
        y: '14',
        textStyle: {
            fontSize: 10,
            fontStyle: 'normal',
            fontWeight: 'normal',
            color: "#fff"
        },

    },
    tooltip: {
        trigger: 'axis'
    },
    grid: [
        {x: '30', y: '42'}],
    xAxis: [
        {
            type: 'category',

            axisLabel: {
                interval: 0,
                rotate: 0,//60度角倾斜显示
                position: 'left',
                textStyle: {
                    color: "#ddd",
                }
            },
            data: ['标准地址', '地址资源', '地址元素', '分词接口', '圆检索', '矩形检索', '面检索'],
            axisLine: {
                show: true,
                onZero: true,
                lineStyle: {
                    color: '#fff',
                    type: 'solid',
                },
            },
        }
    ],
    yAxis: [
        {
            type: 'value',
            axisLabel: {
                position: 'left',
                textStyle: {
                    color: "#fff"
                }
            },
            axisLine: {
                show: true,
                onZero: true,
                lineStyle: {
                    color: '#fff',
                    type: 'solid',
                },
            },
            splitLine: {
                show: true,
                onGap: null,
                lineStyle: {
                    color: 'rgba(255,255,255,0.2)',
                    type: 'solid',
                }
            },
            splitArea: {
                show: false,
            }

        }
    ],
    color: ['#ffc435'],
    series: [
        {
            name: '面积',
            type: 'bar',
            barWidth: '20',
            data: [46, 15, 25, 32, 15, 24, 25],
            itemStyle: {
                emphasis: {
                    barBorderRadius: [0, 0, 0, 0]
                },

                normal: {
                    barBorderRadius: [0, 0, 0, 0]
                }
            },
            markLine: {
                data: [
                    {type: 'average', name: '平均值'}
                ]
            }
        }
    ],
    textStyle: [{
        fontSize: '10px',
        color: '#fff'
    },

    ],
    lineStyle: [{
        color: '#000',
    }]
};
myChartthree.setOption(optionthree);


// 折线面积图
var statisticalPattern = "days";
var time = [];
var elementData = [];
var standardData = [];
$.post("/addressElement/getLineChart",{time:statisticalPattern}, function (resp) {
    if(resp.errorCode != 200) {
        layer.msg(resp.msg);
    }else{
        if(statisticalPattern == "months"){
            $(resp.element).each(i => {
                time.push(resp.element[i].months);
                elementData.push(resp.element[i].count);
            });
            $(resp.standard).each(i => {standardData.push(resp.standard[i].count);});
        }else{
            $(resp.element).each(i => {
                time.push(resp.element[i].days);
                elementData.push(resp.element[i].count);
            });
            $(resp.standard).each(i => {standardData.push(resp.standard[i].count);});
        }
        initLineCharts();
    }
}, "json");
// 折线统计时间切换重新实例化line charts
function initLineCharts() {
    var myChartfour = echarts.init(document.getElementById('chartsfour'), "macarons");
    var optionfour = {
        title: {
            text: '入库数量',
            /*subtext: '新增数量',*/
            textStyle: {
                fontSize: 16,
                color: "#fff"
            },
            subtextStyle: {
                fontSize: 10,
                color: "#fff"
            },
        },
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data: ['标准地址', '地址元素'],
            textStyle: {
                fontSize: 10,
                color: "#fff"
            },
        },
        toolbox: {
            show : true,
            orient: 'horizontal',      // 布局方式，默认为水平布局，可选为：
                                       // 'horizontal' ¦ 'vertical'
            x: 'right',                // 水平安放位置，默认为全图右对齐，可选为：
                                       // 'center' ¦ 'left' ¦ 'right'
                                       // ¦ {number}（x坐标，单位px）
            y: 'top',                  // 垂直安放位置，默认为全图顶端，可选为：
                                       // 'top' ¦ 'bottom' ¦ 'center'
                                       // ¦ {number}（y坐标，单位px）
            color : ['#1e90ff','#22bb22','#4b0082','#d2691e'],
            backgroundColor: 'rgba(0,0,0,0)', // 工具箱背景颜色
            borderColor: '#ccc',       // 工具箱边框颜色
            borderWidth: 0,            // 工具箱边框线宽，单位px，默认为0（无边框）
            padding: 5,                // 工具箱内边距，单位px，默认各方向内边距为5，
            showTitle: true,
            feature : {
                mark : {
                    show : true,
                    title : {
                        mark : '辅助线-开关',
                        markUndo : '辅助线-删除',
                        markClear : '辅助线-清空'
                    },
                    lineStyle : {
                        width : 1,
                        color : '#1e90ff',
                        type : 'dashed'
                    }
                },
                dataZoom : {
                    show : true,
                    title : {
                        dataZoom : '区域缩放',
                        dataZoomReset : '区域缩放-后退'
                    }
                },
                magicType: {
                    show : true,
                    title : {
                        line : '动态类型切换-折线图',
                        bar : '动态类型切换-柱形图',
                        stack : '动态类型切换-堆积',
                        tiled : '动态类型切换-平铺'
                    },
                    type : ['line', 'bar', 'stack', 'tiled']
                },
                restore : {
                    show : true,
                    title : '还原',
                    color : 'black'
                },
                saveAsImage : {
                    show : true,
                    title : '保存为图片',
                    type : 'jpeg',
                    lang : ['点击本地保存']
                },
                myTool : {
                    show : true,
                    title : statisticalPattern == "months"?"日期":"月份",
                    icon : 'image://../images/time-i.png',
                    onclick : function () {
                        statisticalPattern = statisticalPattern == "months" ? "days" : "months";
                        layer.load(1);
                        $.post("/addressElement/getLineChart", {time:statisticalPattern},function (resp) {
                            layer.closeAll("loading");
                            if (resp.errorCode != 200) {
                                layer.msg(resp.msg);
                            } else {
                                time = [];
                                elementData = [];
                                standardData = [];
                                if (statisticalPattern == "months") {
                                    $(resp.element).each(i => {
                                        time.push(resp.element[i].months);
                                        elementData.push(resp.element[i].count);
                                    });
                                    $(resp.standard).each(i => {standardData.push(resp.standard[i].count);});
                                } else {
                                    $(resp.element).each(i => {
                                        time.push(resp.element[i].days);
                                        elementData.push(resp.element[i].count);
                                    });
                                    $(resp.standard).each(i => {standardData.push(resp.standard[i].count);});
                                }
                                initLineCharts();
                            }
                        })
                    }
                }
            }
        },
        calculable: true,
        xAxis: [
            {
                type: 'category',
                boundaryGap: false,
                data: time,
                axisLine: {
                    show: true,
                    onZero: true,
                    lineStyle: {
                        color: '#fff',
                        type: 'solid',
                    },
                },
            }
        ],
        yAxis: [
            {
                type: 'value',
                axisLine: {
                    show: true,
                    onZero: true,
                    lineStyle: {
                        color: '#fff',
                        type: 'solid',
                    },
                },
                splitLine: {
                    show: true,
                    onGap: null,
                    lineStyle: {
                        color: 'rgba(255,255,255,0.1)',
                        type: 'solid',
                    }
                },
            }
        ],
        series: [
            {
                name: '地址元素',
                type: 'line',
                smooth: true,
                itemStyle: {
                    normal: {
                        lineStyle: {
                            color: "rgba(255,70,231,1)" // 图表中各个图区域的边框线颜色
                        },
                        areaStyle: {
                            color: "rgba(255,70,231,0.5)"
                        }
                    }
                },
                data: elementData
            },
            {
                name: '标准地址',
                type: 'line',
                smooth: true,
                itemStyle: {
                    normal: {
                        lineStyle: {
                            color: "rgba(0,216,127,1)" // 图表中各个图区域的边框线颜色
                        },
                        areaStyle: {
                            color: "rgba(0,216,127,0.5)"
                        }
                    }
                },
                data: standardData
            },
        ]
    };
    myChartfour.setOption(optionfour);
}
